body, html {
	height: 100%
}
.home-menus {
  position: absolute;
  bottom: 0;
  width: 100%;
 
}
.home-menus button {
  width: 20%;
  float: left;
  height: 4.97222222rem;
  background: none;
  background: url('../images/home/home-footer.png') no-repeat;
  background-size: 500%;
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  -ms-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
  transition-timing-function: cubic-bezier(0, 0.74, 0.52, 1.38);
}

.home-menus button.PY {
	 
  background-position: 0%;
}
.home-menus button.shop {
	
	
  background-position:  25%;
}
.home-menus button.shop1 {
	
  background-position: 50%;
}
.home-menus button.log {
	
  background-position: 75%;
}
.home-menus button.rule {
	
  background-position: 100%;
} 

.home-menus button.cur {
  -webkit-transform: scale(1.2, 1.2);
  -moz-transform: scale(1.2, 1.2);
  -ms-transform: scale(1.2, 1.2);
  -o-transform: scale(1.2, 1.2);
  transform: scale(1.2, 1.2);
  transform-origin: bottom;
}

.chicken-page {
	background: #f3c580;
	min-height: 100%;
	width: 100%;
	overflow-x: hidden;
	position: relative;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	-moz-flex-direction: column;
	-ms-flex-direction: column;
	-o-flex-direction: column;
	flex-direction: column
}
.chicken-page .notice {
	line-height: 1.667rem;
	font-size: .722rem;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	background: #dff8ff
}
.chicken-page .notice em {
	position: relative;
	z-index: 1;
	background: url(../images/farm/horn.png) .5rem center no-repeat;
	background-size: 1.528rem;
	color: red;
	padding-left: 2.5rem;
	padding-right: .278rem
}
.chicken-page .userBox .headImg, .chicken-page .userBox button, .chicken-page .userBox button.tips:before {
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center center
}
.chicken-page .notice p {
	-webkit-box-flex: 1;
	-moz-box-flex: 1;
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
	display: block;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: inherit;
	position: relative
}
.chicken-page .notice p span {
	position: absolute;
	animation: textmove 5s linear infinite;
	-webkit-animation: textmove 5s linear infinite
}
.chicken-page .userBox {
	position: relative;
	margin-top: .278rem;
	z-index: 3
}
.chicken-page .userBox img.bg {
	display: block;
	width: 100%
}
.chicken-page .userBox section {
	text-align: right;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	border-bottom: .38888889rem solid transparent
}
.chicken-page .userBox .headImg {
	position: absolute;
	top: 50%;
	left: 1.333rem;
	margin-top: -1.45833333rem;
	width: 2.91666667rem;
	height: 2.91666667rem;
	-webkit-border-radius: 100px;
	-moz-border-radius: 100px;
	border-radius: 100px
}
.chicken-page .userBox button {
	display: inline-block;
	width: 3rem;
	height: 2.86111111rem;
	background-color: transparent;
	position: relative;
	z-index: 1
}
.chicken-page .userBox button:after {
	content: '0';
	color: transparent
}
.Bubble .clickShowBox i:after, .chicken-page .userBox .item .clm:after, .chicken-page .userBox button.tips:before, .desktop button:after, section.chart:after, ul.field:before {
	content: ''
}
.chicken-page .userBox button.library {
	background-image: url(../images/farm/library.png)
}
.chicken-page .userBox button.friend {
	background-image: url(../images/farm/friend.png)
}
.chicken-page .userBox button:first-of-type {
	margin-right: .25rem
}
.chicken-page .userBox button:last-of-type {
	margin-right: 1.44444444rem
}
.chicken-page .userBox button.tips:before {
	top: -.35rem;
	right: -.2rem;
	position: absolute;
	width: .86111111rem;
	height: .97222222rem;
	background-image: url()
}
.chicken-page .userBox .item .clm-r, .chicken-page .userBox .r-vine, .dataEdit {
	right: 0
}
.chicken-page .userBox .item {
	position: absolute;
	line-height: 1.11111111rem;
	width: 100%;
	height: 100%;
	top: 0;
	padding-right: 7.94444444rem;
	padding-left: 4.66666667rem;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box
}
.chicken-page .userBox .item p {
	text-align: left;
	background: #e7c55f;
	-webkit-border-radius: 100px;
	-moz-border-radius: 100px;
	border-radius: 100px;
	box-shadow: inset 0 .13888889rem 0 0 #ce9f22;
	color: #864714;
	font-size: .66666667rem;
	border: 1px solid #fffae3;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box
}
.chicken-page .userBox .item .clm:after, .chicken-page .userBox em.btn, ul.field li {
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center center
}
.chicken-page .userBox .item .name {
	width: 100%;
	display: block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	padding-left: .41666667rem
}
.chicken-page .userBox .item .clm {
	position: absolute;
	bottom: .61111111rem;
	bottom: .5rem;
	text-align: right;
	width: 48%;
	padding-right: .38888889rem
}
.chicken-page .userBox .item .clm:after {
	-webkit-transform: scale(.9, .9);
	-moz-transform: scale(.9, .9);
	-ms-transform: scale(.9, .9);
	-o-transform: scale(.9, .9);
	transform: scale(.9, .9);
	left: -.4rem;
	position: absolute;
	top: 50%
}
.chicken-page .userBox .item .clm-l, .chicken-page .userBox .l-vine {
	left: 0
}
.chicken-page .userBox .item .clm.round:after {
	width: 1.2rem
}
.chicken-page .userBox .item .clm-l:after {
	width: 1.72222222rem;
	height: 1.30555556rem;
	background-image: url(../images/farm/egg.png);
	margin-top: -.65277778rem
}
.chicken-page .userBox .item .clm-r:after {
	width: 1.63888889rem;
	height: 1.36111111rem;
	background-image: url(../images/farm/chicken.png);
	margin-top: -.68055556rem
}
.chicken-page .userBox .item-content {
	height: 100%;
	position: relative;
	padding-top: .5rem;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box
}
.chicken-page .userBox .vine {
	position: absolute;
	height: 6rem;
	top: -.27777778rem
}
.chicken-page .userBox em.btn {
	z-index: 1;
	position: absolute;
	width: 3.11111111rem;
	height: 2.16666667rem;
	top: 3.52777778rem
}
.chicken-page .userBox em.btn.back {
	background-image: url(../images/farm/em.btn-l.png);
	left: .27777778rem
}
.chicken-page .userBox em.btn.back a {
	width:100%;
	height:100%;
	display:block;
	}
.chicken-page .userBox em.btn.refresh {
	background-image: url(../images/farm/em.btn-r.png);
	right: .27777778rem
}
@keyframes textmove {
to {
-webkit-transform:translate3d(-100%, 0, 0);
transform:translate3d(-100%, 0, 0)
}
}
@-webkit-keyframes textmove {
to {
-webkit-transform:translate3d(-100%, 0, 0);
transform:translate3d(-100%, 0, 0)
}
}
.fieldBox {
	-webkit-flex-grow: 1;
	-moz-flex-grow: 1;
	-ms-flex-grow: 1;
	-o-flex-grow: 1;
	flex-grow: 1;
	overflow: hidden;
	position: relative
}
.fieldBox .middleware {
	position: absolute;
	height: 100%;
	width: 100%;
	overflow-y: auto;
	overflow-x: hidden
}
.fieldBox .middleware::-webkit-scrollbar {
width:1px
}
ul.field {
	margin: 2.22222222rem .94444444rem;
	margin-bottom: 19vw;
	position: relative;
	z-index: 2;
	height:350px;
}
ul.field li {
	position: relative;
	margin-top: -.77777778rem;
	z-index: 1;
	opacity: 1;
	height:350px;
}
ul.field li.green {
	width:100%;
	background-image: url(../images/farm/green-field.png)
}
ul.field li.gold {
	background-image: url(../images/farm/gold-field.png)
}
ul.field li.lv1:after, ul.field li.lv2:after, ul.field li.lv3:after, ul.field li.lv4:after {
	z-index: 10;
	content: '';
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center center;
	width: 5.36111111rem;
	height: 1.63888889rem;
	bottom: 1.11111111rem;
	position: absolute;
	left: 50%;
	margin-left: -2.68055556rem
}
ul.field li.lv1:after {
	background-image: url(../images/farm/lv.1.png)
}
ul.field li.lv2:after {
	background-image: url(../images/farm/lv.2.png)
}
ul.field li.lv3:after {
	background-image: url(../images/farm/lv.3.png)
}
ul.field li.lv4:after {
	background-image: url(../images/farm/lv.4.png)
}
ul.field li em.up {
	position: absolute;
	width: 100%;
	text-align: center;
	color: #fef127;
	font-size: 1.16666667rem;
	font-weight: 700;
	text-shadow: 0 0 2px #694b21, 0 0 2px #694b21, 0 0 2px #694b21;
	z-index: 50
}
ul.field li div.chicken-box {
	position: absolute;
	z-index: 2
}
ul.field li div.run-move {
	animation: chicken-move 15s linear infinite alternate;
	-webkit-animation: chicken-move 15s linear infinite alternate;
	width: 20%;
	height: 26%
}
ul.field li div.run-move span.txt {
	font-size: 14px;
	color: #333333;
	position: absolute;
	right: 0;
	top: -0.5rem;
}
ul.field li div.walk-move {
	animation: chicken-walk 15s linear infinite alternate;
	-webkit-animation: chicken-walk 15s linear infinite alternate;
	width: 30%;
	height: 38.5%
}
.floor-bg, ul.field:before {
	width: 100%;
	position: absolute
}
ul.field li i.chicken-run {
	display: block;
	height: 100%;
	background: url(../images/farm/run/run.png) no-repeat;
	background-size: 900%;
	animation: chicken 5s steps(8) infinite both;
	-webkit-animation: chicken 5s steps(8) infinite both
}
ul.field li i.chicken-walk {
	display: block;
	height: 100%;
	background: url(../images/farm/walk/walk.png) no-repeat;
	background-size: 700%;
	animation: chicken 5s steps(6) infinite both;
	-webkit-animation: chicken 5s steps(6) infinite both
}
ul.field li.canOpen, ul.field li.canUp {
	animation: flash 1s infinite;
	-webkit-animation: flash 1s infinite
}
ul.field:before {
	height: 100%;
	background: #e29c72;
	-webkit-border-radius: .55555556rem;
	-moz-border-radius: .55555556rem;
	border-radius: .55555556rem;
	-webkit-box-shadow: 0 0 0 1px #f9d297;
	-moz-box-shadow: 0 0 0 1px #f9d297;
	box-shadow: 0 0 0 1px #f9d297;
	border: none
}
.floor-bg {
	width: 100vw;
	display: block;
	top: -2.16666667rem;
	left: -.94444444rem
}
@keyframes flash {
50% {
opacity:.2
}
}
@-webkit-keyframes flash {
50% {
opacity:.2
}
}
@keyframes chicken {
0% {
background-position:0
}
100% {
background-position:100%
}
}
@-webkit-keyframes chicken {
0% {
background-position:0
}
100% {
background-position:100%
}
}
.Bubble>i, .desktop button {
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center center
}
@keyframes chicken-move {
0%, 100% {
transform:translate3d(0, 0, 0);
-webkit-transform:translate3d(0, 0, 0)
}
50% {
transform:translate3d(420%, 0, 0);
-webkit-transform:translate3d(420%, 0, 0)
}
}
@-webkit-keyframes chicken-move {
0%, 100% {
transform:translate3d(0, 0, 0);
-webkit-transform:translate3d(0, 0, 0)
}
50% {
transform:translate3d(420%, 0, 0);
-webkit-transform:translate3d(420%, 0, 0)
}
}
@keyframes chicken-walk {
0%, 100% {
transform:translate3d(0, 0, 0);
-webkit-transform:translate3d(0, 0, 0)
}
50% {
transform:translate3d(20%, 0, 0);
-webkit-transform:translate3d(20%, 0, 0)
}
}
@-webkit-keyframes chicken-walk {
0%, 100% {
transform:translate3d(0, 0, 0);
-webkit-transform:translate3d(0, 0, 0)
}
50% {
transform:translate3d(20%, 0, 0);
-webkit-transform:translate3d(20%, 0, 0)
}
}
.desktop {
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	z-index: 10
}
.desktop img {
	position: absolute;
	bottom: 0;
	z-index: 0;
	display: block;
	width: 100%
}
.desktop div {
	height: 5rem;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	margin: 0 .55555556rem;
	position: relative;
	z-index: 1
}
.desktop button {
	-webkit-box-flex: 1;
	-moz-box-flex: 1;
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
	background-color: transparent;
	-webkit-transition: all .3s;
	-o-transition: all .3s;
	-ms-transition: all .3s;
	-moz-transition: all .3s;
	transition: all .3s;
	transition-timing-function: cubic-bezier(0, .74, .52, 1.38)
}
.desktop button:after {
	opacity: 0
}
.desktop .reclaim {
	background: url('../images/home/home-footer.png') no-repeat;
	background-position: 0%;
	background-size: 500%;
}
.desktop .reclaim.cur, .desktop .reclaim:after {
	background: url('../images/home/home-footer.png') no-repeat;
	background-position: 0%;
	background-size: 500%;
}
.desktop .Up {
	background: url('../images/home/home-footer.png') no-repeat;
	background-position: 25%;
	background-size: 500%;
}
.desktop .Up.cur, .desktop .Up:after {
	background: url('../images/home/home-footer.png') no-repeat;
	background-position: 25%;
	background-size: 500%;
}
.desktop .hatch {
	background: url('../images/home/home-footer.png') no-repeat;
	background-position: 50%;
	background-size: 500%;
}
.desktop .hatch.cur, .desktop .hatch:after {
	background: url('../images/home/home-footer.png') no-repeat;
	background-position: 50%;
	background-size: 500%;
}
.desktop .harvest {
	background: url('../images/home/home-footer.png') no-repeat;
	background-position: 75%;
	background-size: 500%;
}
.desktop .harvest.cur, .desktop .harvest:after {
	background: url('../images/home/home-footer.png') no-repeat;
	background-position: 75%;
	background-size: 500%;
}
.desktop .machine {
	background: url('../images/home/home-footer.png') no-repeat;
	background-position: 100%;
	background-size: 500%;
}
.desktop .machine.cur, .desktop .machine:after {
	background: url('../images/home/home-footer.png') no-repeat;
	background-position: 100%;
	background-size: 500%;
}
.desktop .cur {
	-webkit-transform: scale(1.2, 1.2);
	-moz-transform: scale(1.2, 1.2);
	-ms-transform: scale(1.2, 1.2);
	-o-transform: scale(1.2, 1.2);
	transform: scale(1.2, 1.2);
	transform-origin: bottom
}
.dog {
	z-index: 100;
	position: fixed;
	top: 200px;
	left: 0;
	width: 4.05555556rem;
	height: 5.44444444rem;
	overflow: hidden
}
.dog div, .dog img {
	position: relative
}
.dog div {
	float: left;
	left: 50%;
	clear: both;
	top: -21%
}
.dog img {
	width: 180%;
	left: -90%;
	white-space: nowrap
}
.Bubble, .Bubble>i {
	position: absolute
}
.Bubble {
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	z-index: 20
}
.Bubble>i {
	opacity: 0;
	-webkit-transition: all .3s;
	-o-transition: all .3s;
	-ms-transition: all .3s;
	-moz-transition: all .3s;
	transition: all .3s;
	-webkit-transform: scale(.8, .8);
	-moz-transform: scale(.8, .8);
	-ms-transform: scale(.8, .8);
	-o-transform: scale(.8, .8);
	transform: scale(.8, .8);
	display: block;
	width: 3rem;
	height: 3.27777778rem;
	background-image: url(../images/farm/Bubble-egg.png);
	left: 50%;
	top: 30%;
	margin-left: -1.5rem;
	margin-top: -1.63888889rem;
	pointer-events: none
}
.Bubble.egg>i {
	opacity: 1;
	-webkit-transform: scale(1, 1);
	-moz-transform: scale(1, 1);
	-ms-transform: scale(1, 1);
	-o-transform: scale(1, 1);
	transform: scale(1, 1);
	pointer-events: initial
}
.Bubble .clickShowBox {
	opacity: 0;
	-webkit-transition: all .3s;
	-o-transition: all .3s;
	-ms-transition: all .3s;
	-moz-transition: all .3s;
	transition: all .3s;
	-webkit-transform: translate3d(0, 10%, 0);
	-moz-transform: translate3d(0, 10%, 0);
	-ms-transform: translate3d(0, 10%, 0);
	-o-transform: translate3d(0, 10%, 0);
	transform: translate3d(0, 10%, 0);
	z-index: 10!important;
	position: absolute;
	left: 0;
	right: 0;
	padding: .27777778rem .44444444rem;
	color: #864714;
	font-size: .61111111rem;
	line-height: .91666667rem;
	background: #fff;
	-webkit-border-radius: .5rem;
	-moz-border-radius: .5rem;
	border-radius: .5rem;
	border: .08333333rem solid #694b21;
	top: -2.94444444rem
}
.Bubble .clickShowBox p {
	text-align: right;
	position: relative;
	background: #ffe8a2;
	-webkit-border-radius: 100px;
	-moz-border-radius: 100px;
	border-radius: 100px;
	margin-bottom: .11111111rem
}
.Bubble .clickShowBox p:last-of-type {
	margin: 0
}
.Bubble .clickShowBox b {
	font-weight: 400;
	position: absolute;
	left: .16666667rem;
	top: 0
}
.Bubble .clickShowBox em {
	margin-right: .27777778rem
}
.Bubble .clickShowBox i {
	overflow: hidden;
	position: absolute;
	width: 40%;
	height: 1rem;
	left: 50%;
	margin-left: -20%;
	top: 100%
}
.Bubble .clickShowBox i:after {
	position: absolute;
	height: .46666667rem;
	width: .46666667rem;
	border: .08333333rem solid #694b21;
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	transform: rotate(-45deg);
	background: #fff;
	margin-top: -.30555556rem;
	left: 50%;
	margin-left: -.23333333rem
}
.chicken-page.home, .dataEdit, .eggAnimation i {
	background-repeat: no-repeat;
	background-position: center center
}
.Bubble .clickShowBox.show {
	animation-name: clickShowBoxUp;
	animation-duration: .3s;
	animation-fill-mode: forwards;
	-webkit-animation-name: clickShowBoxUp;
	-webkit-animation-duration: .3s;
	-webkit-animation-fill-mode: forwards
}
@-webkit-keyframes clickShowBoxUp {
from {
opacity:0;
-webkit-transform:translate3d(0, 100%, 0);
transform:translate3d(0, 100%, 0)
}
to {
opacity:1;
-webkit-transform:none;
transform:none
}
}
@keyframes clickShowBoxUp {
from {
opacity:0;
-webkit-transform:translate3d(0, 100%, 0);
transform:translate3d(0, 100%, 0)
}
to {
opacity:1;
-webkit-transform:none;
transform:none
}
}
.clickShowBox-shade {
	position: fixed;
	z-index: 500;
	width: 100%;
	width: 100vw;
	height: 100%;
	height: 100vh;
	left: 0;
	top: 0
}
.eggAnimation {
	position: absolute;
	z-index: 50;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0
}
.eggAnimation i {
	position: absolute;
	width: 3rem;
	height: 3.27777778rem;
	background-size: contain;
	background-image: url(../images/farm/Bubble-egg.png);
	opacity: 1;
	transition-timing-function: ease-out
}
.chicken-page.home {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	background-size: cover;
	background-color: transparent;
	background-image: url(../images/home/home-bg.png)
}
.dataEdit {
	z-index: 1;
	position: absolute;
	top: .33333333rem;
	background-size: contain;
	width: 1.22222222rem;
	height: 1.58333333rem;
	background-image: url()
}
.home-footer {
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%
}
.home-footer button {
	width: 25%;
	float: left;
	height: 4.97222222rem;
	background: url(../images/home/home-footer.png) no-repeat;
	background-size: 400%;
	-webkit-transition: all .3s;
	-o-transition: all .3s;
	-ms-transition: all .3s;
	-moz-transition: all .3s;
	transition: all .3s;
	transition-timing-function: cubic-bezier(0, .74, .52, 1.38)
}
.home-footer button.PY {
	background-position: 0
}
.home-footer button.shop {
	background-position: 35%
}
.home-footer button.log {
	background-position: 66%
}
.home-footer button.rule {
	background-position: 100%
}
.home-footer button.cur {
	-webkit-transform: scale(1.2, 1.2);
	-moz-transform: scale(1.2, 1.2);
	-ms-transform: scale(1.2, 1.2);
	-o-transform: scale(1.2, 1.2);
	transform: scale(1.2, 1.2);
	transform-origin: bottom
}
.chart-title {
	position: absolute;
	z-index: 1;
	width: 10.05555556rem;
	left: 50%;
	margin-left: -5.02777778rem;
	margin-top: -.44444444rem
}
section.chart {
	position: absolute;
	width: 100%;
	top: 7.13888889rem;
	bottom: 5.16666667rem
}
section.chart:after {
	position: absolute;
	width: 100%;
	top: 0;
	left: 0;
	bottom: 4.72222222rem;
	background: url(../images/home/paper.png) no-repeat;
	background-size: 100% 100%
}
#LineChart, section.chart button {
	z-index: 1;
	left: 50%;
	position: absolute
}
section.chart .board, section.chart .paper {
	position: absolute;
	width: 100%
}
section.chart .board {
	height: 100%
}
section.chart button {
	width: 80%;
	margin-left: -40%;
	bottom: 1.11111111rem;
	color: #fff;
	font-size: 1.27777778rem;
	text-align: center;
	text-shadow: 0 0 #a95800
}
.yellowBtn span, button.buffBtn span, button.grayBtn span {
	text-shadow: 0 0 1px #a95800, 0 0 1px #a95800, 0 0 2px #a95800, 0 0 1px #a95800, 0 0 1px #a95800, 0 0 2px #a95800
}
#LineChart {
	width: 86%;
	margin-left: -43%;
	top: 2.69444444rem;
	bottom: 5.44444444rem
}
.yellowBtn:after, .yellowBtn:before {
	content: '';
	width: .94444444rem
}
#LineChart>div {
	position: absolute!important
}
#LineChart .subtext {
	font-size: .66666667rem;
	color: #f46424;
	margin-left: 1.77777778rem
}
.yellowBtn {
	height: 3.27777778rem;
	line-height: 3.27777778rem;
	background: url();
	background-size: 100% 100%
}
.yellowBtn span, .yellowBtn:after, .yellowBtn:before {
	position: absolute;
	height: 100%;
	top: 0
}
.yellowBtn:before {
	left: -.88888889rem;
	background: url() right top no-repeat;
	background-size: auto 100%
}
.yellowBtn:after {
	right: -.88888889rem;
	background: url() left top no-repeat;
	background-size: auto 100%
}
.yellowBtn:active {
	background-image: url()
}
.yellowBtn:active:before {
	background-image: url()
}
.yellowBtn:active:after {
	background-image: url()
}
.yellowBtn span {
	width: 100%;
	left: 0;
	line-height: 2.77777778rem
}
button.buffBtn:after, button.buffBtn:before {
	content: '';
	width: .94444444rem
}
button.buffBtn {
	height: 3.27777778rem;
	line-height: 3.27777778rem;
	background: url();
	background-size: 100% 100%
}
button.buffBtn span, button.buffBtn:after, button.buffBtn:before {
	position: absolute;
	height: 100%;
	top: 0
}
button.buffBtn:before {
	left: -.88888889rem;
	background: url() right top no-repeat;
	background-size: auto 100%
}
button.buffBtn:after {
	right: -.88888889rem;
	background: url() left top no-repeat;
	background-size: auto 100%
}
button.buffBtn:active {
	background-image: url()
}
button.buffBtn:active:before {
	background-image: url()
}
button.buffBtn:active:after {
	background-image: url()
}
button.buffBtn span {
	width: 100%;
	left: 0;
	line-height: 2.77777778rem
}
button.grayBtn:after, button.grayBtn:before {
	width: .94444444rem;
	content: ''
}
button.buffBtn:before {
	background-image: url()
}
button.buffBtn:after {
	background-image: url()
}
button.grayBtn {
	height: 3.27777778rem;
	line-height: 3.27777778rem;
	background: url();
	background-size: 100% 100%
}
button.grayBtn span, button.grayBtn:after, button.grayBtn:before {
	height: 100%;
	position: absolute;
	top: 0
}
button.grayBtn:before {
	left: -.88888889rem;
	background: url() right top no-repeat;
	background-size: auto 100%
}
button.grayBtn:after {
	right: -.88888889rem;
	background: url() left top no-repeat;
	background-size: auto 100%
}
button.grayBtn span {
	width: 100%;
	left: 0;
	line-height: 2.77777778rem
}
button.grayBtn:before {
	background-image: url()
}
button.grayBtn:after {
	background-image: url()
}
button.grayBtn:active {
	background-image: url()
}
button.grayBtn:active:before {
	background-image: url()
}
button.grayBtn:active:after {
	background-image: url()
}
button.clean {
	-webkit-transition: all 6s;
	-o-transition: all 6s;
	-ms-transition: all 6s;
	-moz-transition: all 6s;
	transition: all 6s;
	position: absolute;
	width: 3.25rem;
	height: 4.056rem;
	background: url(../images/farm/friend/clean.png) no-repeat;
	background-size: 100%;
	bottom: .667rem;
	left: 50%;
	margin-left: -1.625rem;
	-webkit-transform: scale(1, 1)!important;
	-moz-transform: scale(1, 1)!important;
	-ms-transform: scale(1, 1)!important;
	-o-transform: scale(1, 1)!important;
	transform: scale(1, 1)!important
}
button.clean:after {
	content: '';
	width: 100%;
	height: 100%;
	display: block;
	background: url(../images/farm/friend/cleaned.png);
	background-size: 100%;
	opacity: 0
}
button.clean.cur {
	background-image: url(../images/farm/friend/cleaned.png)
}
section.Alert-oneBtn .min {
	display: block!important
}
section.shade {
	z-index: 110;
	position: fixed;
	width: 100%;
	width: 100vw;
	height: 100%;
	height: 100vh;
	background: rgba(0,0,0,.8);
	top: 0;
	left: 0;
	opacity: 1
}
section.shade.Alert-oneBtn p {
	position: relative;
	z-index: 1;
	text-align: center;
	font-size: 1.11111111rem;
	color: #864714;
	padding: 4.3rem 2rem 0;
	line-height: 1em
}
section.shade.Alert-oneBtn p em {
	color: #df6700
}
section.shade.Alert-oneBtn button {
	position: absolute;
	font-size: 1.11111111rem;
	color: #fff;
	width: 80%;
	bottom: 1.11111111rem;
	left: 50%;
	margin-left: -40%
}
section.shade>.content {
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	border: 2px solid #5c2f0f;
	-webkit-border-radius: 1.05555556rem;
	-moz-border-radius: 1.05555556rem;
	border-radius: 1.05555556rem;
	position: absolute;
	width: 85.2%;
	left: 50%;
	margin-left: -42.6%;
	background: url(../images/farm/grain.png) repeat-y, #fffae4;
	background-size: 100%;
	top: 10.2%;
	bottom: 18.2%
}
section.shade>.content .title {
	position: absolute;
	width: 10.05555556rem;
	left: 50%;
	margin-left: -5.02777778rem;
	top: -.66666667rem
}
section.shade>.content .title em {
	top: 0;
	left: 0;
	position: absolute;
	width: 100%;
	height: 100%;
	text-align: center;
	color: #fff;
	font-size: .83333333rem;
	font-weight: bolder;
	text-shadow: 0 0 1.5px #864714;
	z-index: 1;
	line-height: 2.58333333rem
}
section.shade>.content .title img {
	display: block
}
section.shade>.content .title-c {
	width: 100%;
	z-index: 1;
	position: relative
}
section.shade>.content .title-l {
	width: 3.11111111rem;
	position: absolute;
	left: -2.5rem;
	top: .27777778rem
}
section.shade>.content .title-r {
	width: 2.13888889rem;
	position: absolute;
	right: -1.61111111rem;
	top: 2px
}
section.shade>.content i.close {
	width: 2.22222222rem;
	height: 2.25rem;
	position: absolute;
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center center;
	background-image: url();
	right: -.44444444rem;
	top: -.22222222rem
}
section.shade>.content i.bottom {
	width: 100%;
	position: absolute;
	left: 0;
	bottom: 0;
	height: 10%;
	background: url() 0 bottom no-repeat;
	background-size: 100%;
	overflow: hidden;
	-webkit-border-radius: .97222222rem;
	-moz-border-radius: .97222222rem;
	border-radius: .97222222rem;
	z-index: 0
}
section.shade>.content i.icon-check {
	display: inline-block;
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center center;
	background-image: url(../images/farm/chicken.png);
	width: 1.611rem;
	height: 1.361rem;
	line-height: 1.361rem
}
section.shade>.content i.icon-check:after {
	content: '　'
}
section.shade>.content .show {
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	width: 87%;
	position: absolute;
	left: 50%;
	margin-left: -43.5%;
	top: 3.16666667rem;
	background: #d0c7a7;
	text-align: center;
	border: 1.5px solid #ac8207;
	-webkit-border-radius: .83333333rem;
	-moz-border-radius: .83333333rem;
	border-radius: .83333333rem;
	box-shadow: 0 0 0 3px #f9e7b2, 0 -.5rem 0 3px #f9e7b2, 0 1px 0 3px #f9e7b2, inset 0 .22222222rem 0 0 #b1a67f
}
section.shade>.content.min {
	width: 78.2%;
	top: 27.1%;
	height: 12.63888889rem;
	margin-left: -39.1%
}
section.shade>.content.min i.bottom {
	height: 20%
}
section.shade>.content.min .flex-box {
	padding: 0 7.22222222rem;
	margin-top: -.75rem;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	width: 100%;
	position: absolute;
	left: 50%;
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	transform: translateX(-50%)
}
section.shade>.content.min .flex-box:after {
	clear: both;
	content: '';
	display: table
}
section.shade>.content.min .f-l, section.shade>.content.min .f-r, section.shade>.content.min .flex {
	float: left;
	height: 8.47222222rem
}
section.shade>.content.min .flex {
	width: 100%;
	background: url(../images/window/min-shade-content-bg.png) 50% center no-repeat;
	background-size: 999% 100%
}
section.shade>.content.min .f-l {
	margin-left: -7.22222222rem;
	width: 7.22222222rem;
	background: url(../images/window/min-shade-content-bg.png) left top no-repeat;
	background-size: auto 100%
}
section.shade>.content.min .f-r {
	margin-right: -7.22222222rem;
	width: 7.22222222rem;
	float: right;
	background: url(../images/window/min-shade-content-bg.png) right top no-repeat;
	background-size: auto 100%
}
section.shade .mchine {
	top: 7.9%;
	bottom: 9.9%
}
section.shade .mchine .show {
	bottom: 9.444rem
}
section.shade .mchine .show img {
	height: 51.6%;
	display: inline-block;
	position: relative;
	margin-top: 10.2%
}
section.shade .mchine .show>div {
	position: absolute;
	width: 100%;
	bottom: 9.5%
}
section.shade .mchine .show p:first-of-type {
	color: #864714;
	font-size: .889rem;
	line-height: 1.556rem
}
section.shade .mchine .show p:first-of-type em {
	color: #fff
}
section.shade .mchine .show p:last-of-type {
	color: #7e703d;
	font-size: .722rem;
	line-height: .861rem
}
section.shade .mchine button {
	position: absolute;
	font-size: 1.111rem;
	color: #fff;
	width: 77%;
	left: 50%;
	margin-left: -38.5%
}
section.shade .mchine button em {
	color: #fef127
}
section.shade .mchine button:first-of-type {
	bottom: 5.194rem
}
section.shade .mchine button:not(:first-of-type) {
	bottom: 1.444rem
}
section.shade .mchine button i.tips {
	z-index: 1;
	top: -.15rem;
	right: -1rem;
	position: absolute;
	width: .861rem;
	height: .972rem;
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center center;
	background-image: url()
}
section.shade .has-mchine button.getChick.grayBtn span {
	text-shadow: 0 0 1px #606060, 0 0 1px #606060, 0 0 2px #606060, 0 0 1px #606060, 0 0 1px #606060, 0 0 2px #606060
}
section.shade .friend-list {
	top: 8.2%;
	bottom: 9.9%
}
section.shade .friend-list .show {
	bottom: 5.83333333rem;
	text-align: inherit;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	z-index: 0
}
section.shade .friend-list .show::-webkit-scrollbar {
display:none
}
section.shade .friend-list li {
	margin: 3.2% 3.77%;
	height: 3.55555556rem;
	border: 1.5px solid #ac8207;
	-webkit-border-radius: .55555556rem;
	-moz-border-radius: .55555556rem;
	border-radius: .55555556rem;
	background: url();
	background-size: 100% 100%;
	position: relative;
	box-shadow: 0 1px 0 0 #ac8207, 0 .19444444rem 0 0 #b9ac7f
}
section.shade .friend-list li button {
	width: 19.2%;
	right: 7.2%
}
section.shade .friend-list li .info {
	height: 100%;
	margin: 0 37% 0 3.52777778rem;
	position: relative
}
section.shade .friend-list li .info .name {
	color: #864714;
	font-size: .83333333rem;
	line-height: 1em;
	position: absolute;
	bottom: 50%;
	margin-bottom: .13888889rem
}
section.shade .friend-list li .info p {
	position: absolute;
	top: 50%;
	margin-top: .13888889rem;
	color: #864714;
	font-size: .58333333rem;
	-webkit-border-radius: 100px;
	-moz-border-radius: 100px;
	border-radius: 100px;
	background: #fffae4;
	line-height: 1rem;
	width: 100%;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	padding-left: 1.6rem
}
section.shade .friend-list li .info .icon {
	width: 1.55555556rem;
	height: 1.19444444rem;
	position: absolute;
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center center;
	top: 50%;
	margin-top: -.59722222rem;
	background-image: url();
	background-color: transparent;
	left: 0
}
section.shade .friend-list .userBox {
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	width: 2.66666667rem;
	height: 2.66666667rem;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
	position: absolute;
	-webkit-border-radius: 100px;
	-moz-border-radius: 100px;
	border-radius: 100px;
	left: .36111111rem;
	top: 50%;
	margin-top: -1.33333333rem;
	border: 1.5px solid #ac8207
}
section.shade .friend-list>button {
	position: absolute;
	width: 31.6%;
	bottom: 1.55555556rem;
	color: #fff;
	font-size: 1.11111111rem
}
section.shade .friend-list>button:first-of-type {
	left: 9.4%
}
section.shade .friend-list>button:last-of-type {
	right: 9.4%
}
section.shade .notice {
	top: 10%;
	bottom: 19%
}
section.shade .notice .show {
	bottom: 1.75rem;
	overflow-y: auto;
	padding: .38888889rem .47222222rem
}
section.shade .notice .show::-webkit-scrollbar {
display:none
}
section.shade .notice li {
	-webkit-border-radius: .5rem;
	-moz-border-radius: .5rem;
	border-radius: .5rem;
	border: 1.5px solid #ac8207;
	margin: .27777778rem 0;
	background-repeat: no-repeat;
	background-size: 100% 3.52777778rem;
	background-color: #f1dc7c;
	background-image: url();
	box-shadow: 0 1.5px 0 0 #ac8207, 0 3px 0 0 #b9ac7f
}
section.shade .notice li:first-of-type, section.shade .notice li:last-of-type {
	margin: 0
}
section.shade .notice li p {
	display: none;
	color: #864714;
	font-size: .55555556rem;
	line-height: 1rem;
	background: #e7c55f;
	border: 1.5px solid #f4e18b;
	-webkit-border-radius: .55555556rem;
	-moz-border-radius: .55555556rem;
	border-radius: .55555556rem;
	padding: .5rem .52777778rem;
	text-align: justify;
	margin: 0 .36111111rem .55555556rem;
	box-shadow: inset 0 .22222222rem 0 0 #c09e39
}
section.shade .notice li:first-of-type p {
	display: block
}
section.shade .notice .top {
	height: 3.52777778rem;
	line-height: 3.52777778rem
}
section.shade .notice .top .name {
	width: 56%;
	background: #e7c55f;
	-webkit-border-radius: 100px;
	-moz-border-radius: 100px;
	border-radius: 100px;
	color: #864714;
	font-size: .83333333rem;
	line-height: 1.66666667rem;
	display: inline-block;
	position: relative
}
section.shade .notice .top .name:after {
	content: '';
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center center;
	background-image: url();
	position: absolute;
	width: 1.83333333rem;
	height: 100%;
	top: 0;
	left: -.6rem
}
section.shade .notice .top time {
	color: #f46424;
	font-size: .61111111rem
}
section.shade .storage {
	top: 5.7%;
	bottom: 7.1%
}
section.shade .storage .show {
	bottom: 1.75rem;
	overflow-y: auto
}
section.shade .storage .show::-webkit-scrollbar {
display:none
}
section.shade .storage .show li {
	height: 3.52777778rem;
	margin: 3.2% 3.77%;
	-webkit-border-radius: .5rem;
	-moz-border-radius: .5rem;
	border-radius: .5rem;
	border: 1.5px solid #ac8207;
	background-repeat: no-repeat;
	background-size: 100% 100%;
	background-image: url();
	box-shadow: 0 1px 0 0 #ac8207, 0 .19444444rem 0 0 #b9ac7f;
	position: relative
}
section.shade .storage .show li.number .content .name {
	margin-left: .27777778rem
}
section.shade .storage .show li.number .content em {
	display: inline-block;
	width: 75%;
	color: #864714;
	font-size: .6rem;
	line-height: 1rem;
	-webkit-border-radius: 100px;
	-moz-border-radius: 100px;
	border-radius: 100px;
	background: #fffae4;
	padding: 0 .5rem
}
section.shade .storage .show .ico {
	display: block;
	height: 100%;
	background: url(../images/window/storage-ico.png) no-repeat;
	background-size: auto 21.16666667rem
}
section.shade .storage .show .ico.egg {
	background-position: 0 -3.52777778rem
}
section.shade .storage .show .ico.fence {
	background-position: 0 -7.05555556rem
}
section.shade .storage .show .ico.haDog {
	background-position: 0 -10.58333333rem
}
section.shade .storage .show .ico.machine {
	background-position: 0 -14.11111111rem
}
section.shade .storage .show .ico.clean {
	background-position: 0 -17.63888889rem
}
section.shade .storage .show .content {
	position: absolute;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
	left: 3.3rem;
	right: 32.4%;
	text-align: initial
}
section.shade .storage .show .name {
	color: #864714;
	font-size: .83333333rem
}
section.shade .storage .show .name .grade {
	position: absolute
}
section.shade .storage .show .info {
	font-size: .6rem;
	color: #b27e54;
	text-align: justify
}
section.shade .storage .show .info em {
	color: #ed6327
}
section.shade .storage .show button {
	position: absolute;
	width: 19.2%;
	right: 7.2%
}
section.shade .storage .show button.grayListBtn span {
	position: absolute;
	z-index: 1;
	width: 145%;
	left: 50%;
	top: 50%;
	-webkit-transform: translate3d(-50%, -50%, 0);
	-moz-transform: translate3d(-50%, -50%, 0);
	-ms-transform: translate3d(-50%, -50%, 0);
	-o-transform: translate3d(-50%, -50%, 0);
	transform: translate3d(-50%, -50%, 0)
}
section.shade .confirm {
	text-align: center
}
section.shade .confirm p {
	position: relative;
	z-index: 1;
	text-align: center;
	font-size: 1.11111111rem;
	color: #864714;
	padding-top: 2.58333333rem;
	line-height: 1em
}
section.shade .confirm label {
	display: inline-block;
	position: relative;
	z-index: 1;
	margin-top: .66666667rem
}
section.shade .confirm label:after {
	content: '';
	position: absolute;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
	background-image: url();
	width: 1.80555556rem;
	height: 2.41666667rem;
	right: -.44444444rem;
	top: 50%;
	margin-top: -1.20833333rem
}
section.shade .confirm input[type=number] {
	text-align: center;
	background: #d2e3bf;
	-webkit-border-radius: 100px;
	-moz-border-radius: 100px;
	border-radius: 100px;
	color: #df6700;
	font-size: 1.11111111rem;
	line-height: 2.19444444rem;
	width: 7.69444444rem;
	border: 1px solid #e8ffce
}
section.shade .confirm button {
	position: absolute;
	font-size: 1.11111111rem;
	color: #fff;
	width: 30%;
	bottom: 1.11111111rem
}
section.shade .confirm button span {
	height: 3.05555556rem
}
section.shade .confirm button:first-of-type {
	left: 11%
}
section.shade .confirm button:last-of-type {
	right: 11%
}
section.shade .NoChick p, section.shade .reap p {
	position: relative;
	z-index: 1;
	text-align: center;
	font-size: 1.11111111rem;
	color: #864714;
	padding: 4.3rem 2rem 0;
	line-height: 1em
}
section.shade .NoChick p em, section.shade .reap p em {
	color: #df6700
}
section.shade .NoChick button, section.shade .reap button {
	position: absolute;
	font-size: 1.11111111rem;
	color: #fff;
	width: 80%;
	bottom: 1.11111111rem;
	left: 50%;
	margin-left: -40%
}
section.shade .invite img, section.shade .register img {
	width: 100%;
	display: block
}
section.shade .buySuper p {
	margin: 0 15%;
	line-height: 1.5
}
section.shade .cleanCheck p {
	position: relative;
	z-index: 1;
	text-align: center;
	font-size: 1.11111111rem;
	color: #864714;
	padding: 2.63888889rem 2rem 0;
	line-height: 1.77777778rem
}
section.shade .cleanCheck p em {
	color: #df6700
}
section.shade .cleanCheck .ico-egg {
	margin-left: .47222222rem;
	display: inline-block;
	width: 1.72222222rem;
	height: 1.30555556rem;
	line-height: 1.30555556rem;
	background: url(../images/window/egg.png) center center;
	background-size: contain
}
section.shade.showClean, section.shade.showClean .cleanAnimation {
	display: block!important
}
section.shade .cleanCheck .ico-egg:after {
	content: '　'
}
section.shade .cleanCheck button {
	position: absolute;
	font-size: 1.11111111rem;
	color: #fff;
	width: 80%;
	bottom: 1.11111111rem;
	left: 50%;
	margin-left: -40%
}
button.grayListBtn, button.redListBtn {
	font-size: .72222222rem;
	color: #fff;
	margin-top: -.91666667rem
}
section.shade .cleanAnimation {
	background: url(../images/window/cleanAnimation.gif) center center no-repeat;
	background-size: 50%;
	height: 100%
}
section.shade.showClean {
	background-color: transparent;
	opacity: 1;
	-webkit-transition: opacity 4s;
	-o-transition: opacity 4s;
	-ms-transition: opacity 4s;
	-moz-transition: opacity 4s;
	transition: opacity 4s
}
button.redListBtn {
	text-shadow: 0 0 1.5px #bc4a18, 0 0 1.5px #bc4a18, 0 0 1.5px #bc4a18;
	height: 1.83333333rem;
	background: url() left top no-repeat;
	background-size: 100% 100%;
	position: absolute;
	top: 50%
}
button.redListBtn:after, button.redListBtn:before {
	height: 100%;
	top: 0;
	content: '';
	position: absolute;
	width: .66666667rem
}
button.redListBtn:before {
	left: -.61111111rem;
	background: url() left top no-repeat;
	background-size: 100% 100%
}
button.redListBtn:after {
	right: -.61111111rem;
	background: url() left top no-repeat;
	background-size: 100% 100%
}
button.grayListBtn {
	text-shadow: 0 0 1.5px #6c6c6c, 0 0 1.5px #6c6c6c, 0 0 1.5px #bc4a18;
	height: 1.83333333rem;
	background: url() left top no-repeat;
	background-size: 100% 100%;
	position: absolute;
	top: 50%
}
button.grayListBtn:before {
	content: '';
	position: absolute;
	width: .66666667rem;
	height: 100%;
	top: 0;
	left: -.61111111rem;
	background: url() left top no-repeat;
	background-size: 100% 100%
}
button.grayListBtn:after {
	content: '';
	position: absolute;
	width: .66666667rem;
	height: 100%;
	top: 0;
	right: -.61111111rem;
	background: url() left top no-repeat;
	background-size: 100% 100%
}
@-webkit-keyframes fadeInUp {
from {
opacity:0;
-webkit-transform:translate3d(0, 100%, 0);
transform:translate3d(0, 100%, 0)
}
to {
opacity:1;
-webkit-transform:none;
transform:none
}
}
@keyframes fadeInUp {
from {
opacity:0;
-webkit-transform:translate3d(0, 100%, 0);
transform:translate3d(0, 100%, 0)
}
to {
opacity:1;
-webkit-transform:none;
transform:none
}
}
.fadeInUp {
	-webkit-animation-name: fadeInUp;
	animation-name: fadeInUp;
	-webkit-animation-duration: .3s;
	animation-duration: .3s
}
.flipx {
	transform: rotateY(180deg)
}
.flipy {
	transform: rotateX(180deg)
}
.prefix {
	white-space: pre;
	word-wrap: break-word
}
.ovfHiden {
	overflow: hidden;
	height: 100%
}
.body-child-fix {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	overflow-y: hidden
}
.cursor-none {
	pointer-events: none
}
/*loading*/
#loadingbg {
	width: 100%;
	height: 100%;
	background: #f8d08b url("../images/loading/loading.jpg") no-repeat;
	background-size: 100% 100%;
	position: fixed;
	left: 0;
	top: 0;
    z-index: 9999;
}

#loadingwrap {
    width: 85.6%;
    position: absolute;
    left: 50%;
    margin-left: -42.8%;
    top: 22.5%;
}
#loadingwrap img.j {
    width: 27.27%;
    display: block;
    margin: 0 auto;
}

#loading {
    height: 100%;
    text-align: center;
    color: #ffffff;
    font-weight: bold;
    font-size: 14px;
    text-shadow: 0 0 2px rgba(0,0,0,0.8);
    position: absolute;
    width: 100px;
    left: 50%;
    margin-left: -50px;
    top: 0;
}
.loading-back {
    background-image: -webkit-linear-gradient( 90deg, rgb(255,48,69) 0%, rgb(249,151,184) 100%);
    border-radius: 5px;
    height: 100%;
}
.loading-out {
    position: relative;
    margin: 10px 0 0 0;
}
.loading-out img.l {
    width: 100%;
    display: block;
}
.loading-out-inner {
    width: 96%;
    position: absolute;
    left: 2%;
    top: 16%;
    height: 63%;
}
img.loading-txt {
    width: 51.562%;
    display: block;
    margin: 10px auto 0 auto;
}